<!DOCTYPE html>
<html lang="en">
    <include file="Public/head" />
    <script type="text/javascript">
    function imgPreview(fileDom){
        //判断是否支持FileReader
        if (window.FileReader) {
            var reader = new FileReader();
        } else {
            alert("您的设备不支持图片预览功能，如需该功能请升级您的设备！");
        }

        //获取文件
        var file = fileDom.files[0];
        var imageType = /^image\//;
        //是否是图片
        if (!imageType.test(file.type)) {
            alert("请选择图片！");
            return;
        }
        //读取完成
        reader.onload = function(e) {
            //获取图片dom
            var img = document.getElementById("preview");
            //图片路径设置为读取的图片
            img.src = e.target.result;
        };
        reader.readAsDataURL(file);
    }
</script>
<body data-type="widgets">
    <script src="__PUBLIC__/assets/js/theme.js"></script>
    <div class="am-g tpl-g">
        <!-- 头部 -->
    <include file="Public/header" />
        <!-- 风格切换 -->
        <div class="tpl-skiner">
            <div class="tpl-skiner-toggle am-icon-cog">
            </div>
            <div class="tpl-skiner-content">
                <div class="tpl-skiner-content-title">
                    选择主题
                </div>
                <div class="tpl-skiner-content-bar">
                    <span class="skiner-color skiner-white" data-color="theme-white"></span>
                    <span class="skiner-color skiner-black" data-color="theme-black"></span>
                </div>
            </div>
        </div>
        
<include file="Public/left" />
        <!-- 内容区域 -->
        <div class="tpl-content-wrapper">

            <div class="row-content am-cf">
                <div class="row">

                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf">
                            <div class="widget-head am-cf">
                                 <div class="widget-title am-fl"><h1 style="display:inline">添加教练</h1><a href="{:U('Club/coach/coachlist')}">返回</a></div>
                            </div>
                            <div class="widget-body  widget-body-lg am-fr">
                                <form class="am-form am-form-horizontal" method='post' enctype="multipart/form-data" action="{:U('add')}">
                                  <div class="am-form-group">
                                    <label class="am-u-sm-3 am-form-label">教练名:</label>
                                    <div class="am-u-sm-6 am-u-sm-centered">
                                      <input type="text" name="coachname" id="coachname" placeholder="请输入教练名">
                                    </div>
                                  </div>

                                  <div class="am-form-group">
                                    <label class="am-u-sm-3 am-form-label">简介:</label>
                                    <div class="am-u-sm-6 am-u-sm-centered">
                                      <textarea rows="5" name="introduction" id="introduction"></textarea>
                                    </div>
                                  </div>

                                  <div class="am-form-group">
                                    <label class="am-u-sm-3 am-form-label">联系电话:</label>
                                    <div class="am-u-sm-6 am-u-sm-centered">
                                      <input type="text" name="phone" id="phone" placeholder="请输入教练联系电话">
                                    </div>
                                  </div>

                                  <div class="am-form-group">
                                    <label class="am-u-sm-3 am-form-label">指教项目:</label>
                                    <div class="am-u-sm-6 am-u-sm-centered">
                                      <input type="text" name="course" id="course" placeholder="请输入教练执教项目">
                                    </div>
                                  </div>

                                      <div class="am-form-group am-form-file">
                                          <label class="am-u-sm-3 am-form-label">奖品图片:</label>
                                          <div class="am-u-sm-6 am-u-sm-centered">
                                            <img id="preview"  width="100" height="100" />
                                          </div>
                                          <div class="am-u-sm-6 am-u-sm-centered">
                                            <button type="button" class="am-btn am-btn-danger am-btn-sm">
                                              <i class="am-icon-cloud-upload"></i> 选择要上传的文件</button>
                                          </div>
                                          <input type="file" name="pic" id="pic" onchange="imgPreview(this)">
                                      </div>

                                  <div class="am-form-group">
                                    <div class="am-u-sm-6 am-u-sm-centered">
                                      <button type="submit" class="am-btn am-btn-primary">提交</button>
                                      <button type="reset" class="am-btn am-btn-default">重置</button>
                                    </div>
                                  </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    </div>

    <include file="Public/bottom" />
</body>

</html>  